<!--
  *@Description : 操作类标题栏
  *@author 萧红
  *@date 2020-03-22 21:40
  *@LastEditTime 2020-03-22 21:40
  *@LastEdititors
-->
<template>
    <div id="title">
      <div v-if="showBack" class="back-btn" @click="$router.back()">
        <i class="cubeic-back"></i>
      </div>
      <div class="text">{{title}}</div>
    </div>
</template>

<script>
export default {
  name: 'Tittle',
  props: {
    title: {
      required: true,
      type: String
    },
    showBack: {
      type: Boolean | Number,
      default: () => 1
    }
  }
}
</script>

<style lang="stylus" scoped>
  #title
  {
    width 100%
    /*line-height 45px*/
    height 45px
    background #ff689b!important
    position relative
    z-index 1
    display flex
    flex-flow row nowrap
    align-items  center
    font-size 14px
    color snow
    .back-btn
    {
      float left
      width 45px
      height 45px
      display flex
      flex-flow  row nowrap
      justify-content center
      align-items center
    }
    .text
    {
      position absolute
      left: 50%
      top 50%
      transform translate(-50%,-50%)
    }
  }

</style>
